/**
 * Copyright (c) 快宝网络 kuaidihelp.com Co., Ltd. All Rights Reserved 禁止外泄以及用于其它的商业用途
 */

/**
 * 拉黑/扣钱不发管理-扣钱不发帐户管理
 * */
import React, { useRef } from 'react';
import DragTable from '@/components/DragTable';
import ProTable from '@ant-design/pro-table';
import { useSelector } from 'umi';
import type { ProColumns, ActionType } from '@ant-design/pro-table';
import type { ConnectState } from '@/models/connect';
import type { deductMoney } from '@/pages/sms/blackDeductMoney/index.d';
import { platform } from '@/pages/sms/specialTmp/index.d';
import { getDeductMoneyList, deductMoneyUntied } from '@/services/sms/blackDeductMoney';
import { ProFormText } from '@ant-design/pro-form';
import { message, Popconfirm } from 'antd';
import styles from './table.less';

const Index: React.FC = () => {
  const { winSize } = useSelector((state: ConnectState) => state.global);
  const actionRef = useRef<ActionType>();
  const handleRequest = async (params: any) => {
    const { current: page, pageSize: limit, cm_phone, cm_id } = params;
    return getDeductMoneyList({ page, limit, cm_phone, cm_id }).then(({ code, data, msg }) => {
      if (code == 0) {
        return { data };
      } else {
        message.error(msg);
        return {};
      }
    });
  };
  const handleBlackClick = async (record: deductMoney) => {
    const { kb_id, cm_id } = record;
    const { code, msg } = await deductMoneyUntied({ kb_id, cm_id });
    if (code == 0) {
      actionRef.current?.reload();
      message.success('操作成功');
      return;
    }
    message.error(msg);
  };

  const columns: ProColumns<deductMoney>[] = [
    {
      title: '快递员/驿站账号',
      dataIndex: 'cm_phone',
      hideInTable: true,
      renderFormItem: () => {
        return <ProFormText placeholder='请输入手机号' />;
      },
    },
    {
      title: '平台标识',
      dataIndex: 'user_type',
      align: 'center',
      search: false,
      width: 100,
      ellipsis: true,
      render: (_: any, record: deductMoney) => {
        const txt = !record.user_type ? '-' : platform[record.user_type];
        return txt;
      },
    },
    {
      title: 'cm_id',
      align: 'center',
      dataIndex: 'cm_id',
      width: 100,
      ellipsis: true,
      renderFormItem: () => {
        return <ProFormText placeholder='请输入cm_id' />;
      },
    },
    {
      title: '帐户',
      dataIndex: 'cm_phone',
      align: 'center',
      search: false,
      width: 100,
      ellipsis: true,
    },
    {
      title: '账户被设置为"只扣不发"时间',
      dataIndex: 'create_time',
      align: 'center',
      search: false,
      width: 160,
      ellipsis: true,
    },
    {
      title: '扣钱不发原因',
      dataIndex: 'reason',
      align: 'center',
      search: false,
      width: 100,
      ellipsis: true,
    },
    {
      title: '操作',
      dataIndex: 'options',
      align: 'center',
      search: false,
      ellipsis: true,
      width: winSize === 'xs' ? 80 : 130,
      fixed: 'right',
      render: (_: any, record: deductMoney) => {
        return (
          <Popconfirm
            title={`你确定恢复下发吗？`}
            onConfirm={handleBlackClick.bind(this, record)}
            key='approved'
          >
            <a>恢复下发</a>
          </Popconfirm>
        );
      },
    },
  ];
  return (
    <DragTable>
      <ProTable<deductMoney>
        actionRef={actionRef}
        rowKey='id'
        request={handleRequest}
        manualRequest
        columns={columns}
        className={styles.deductMoney}
        pagination={{
          pageSize: 30,
          showQuickJumper: false,
          showSizeChanger: false,
        }}
        scroll={{ x: 640 }}
        options={false}
        search={{
          collapsed: false,
        }}
      />
    </DragTable>
  );
};

export default Index;
